<nz-spin [nzSpinning]="isSpinning" *ngIf="validUser">
    <div style="margin-top:50px;min-height: 500px;padding:24px;">
        <nz-alert style="padding:6px 0;font-size:12px;" nzBanner nzMessage="提示：对于用户创建的测试项目，如长时间未使用，系统将定时删除，如需帮助请联系作者。"></nz-alert>
        <p style="text-align:right">
            <button nz-button nzType="primary" (click)="addSys()">新建应用站点</button>
        </p>
        <div nz-row [nzGutter]="24">
            <div nz-col class="gutter-row" nzXs="24" nzSm="8" style="margin-bottom:24px;" *ngFor="let item of sysItems">
                <nz-card nzType="inner" [nzTitle]="emplateTitle" [nzExtra]="extraTemplate">
                    <div class="total_pv_uv">
                        <p> PV(7天)：
                            <span>{{item.total_pv_uv?.totalPv||'--'}}</span>
                        </p>
                        <p> UV(7天)：
                            <span>{{item.total_pv_uv?.totalUv||'--'}}</span>
                        </p>
                    </div>
                    <app-custom-highchart [config]="item.pv_uv_config"></app-custom-highchart>
                </nz-card>
                <ng-template #emplateTitle>
                    <a (click)="gotoSys(item)">{{item.appName}}</a>
                </ng-template>
                <ng-template #extraTemplate>
                    <i class="anticon anticon-setting" style="cursor: pointer;" (click)="gotoSysSetting(item)"></i>
                </ng-template>
            </div>
        </div>
    </div>

</nz-spin>


<nz-modal [nzMaskClosable]="false" [nzOkText]="'确认'" [nzCancelText]="'取消'" [(nzVisible)]="isVisible_add" nzTitle="新建应用站点" (nzOnCancel)="cancel()" (nzOnOk)="save()">
    <nz-form-item>
        <nz-form-label [nzSm]="4" [nzXs]="24">站点名称</nz-form-label>
        <nz-form-control [nzSm]="18" [nzXs]="24">
            <input nz-input [(ngModel)]="appName" name="title">
        </nz-form-control>
    </nz-form-item>
    <!-- <nz-form-item>
      <nz-form-label [nzSm]="4" [nzXs]="24">业务系统ID</nz-form-label>
      <nz-form-control [nzSm]="18" [nzXs]="24">
        <input nz-input [(ngModel)]="systemId" name="systemId">
      </nz-form-control> 
    </nz-form-item> -->
</nz-modal>